<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>新增集训</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
	<c:set var="ctx" value="${pageContext.request.contextPath}" />
    <link rel="stylesheet" href="${ctx}/assets/css/amazeui.min.css">
    <link rel="stylesheet" href="${ctx}/assets/css/style.css?v=2.3">
    <link rel="stylesheet" href="${ctx}/assets/css/index.css?v=2.3">
    <script src="${ctx}/assets/js/myAlert.js"></script>
</head>
<body class="bg-gray">
<header data-am-widget="header" class="am-header am-header-default am-header-fixed am-border-bottom">
    <div class="am-header-left am-header-nav">
        <a onclick="history.go(-1)"> <i class="icon_8"></i>
        </a>
    </div>
    <h1 class="am-header-title">
        新增集训
    </h1>

    <!--<div class="am-header-right am-header-nav am-text-right font-14">-->
        <!--发布-->
    <!--</div>-->
</header>
<form action="${ctx}/gotoAddJixun" id="form1" method="post" enctype="multipart/form-data">
<section class="am-padding-bottom-sm" id="amz-main" data-tag="css-nav">
    <div class="bg-white">

        <div class="am-g am-padding-top-sm am-padding-bottom-xs">


            <div class="am-u-sm-12 ">
                <div class="box  am-margin-bottom-sm ">
                    <div class="width-70px font-15 padding-top-5">集训标题</div>
                    <div class="box-1">
                        <div class=" input-div-3">
                            <input type="text" class="input-3 font-14" id="studyTitle" name="studyTitle" placeholder="请输入集训标题">
                        </div>
                    </div>

                </div>

            </div>

			<div class="am-u-sm-12 ">
                <div class="box  am-margin-bottom-sm ">
                    <div class="width-70px font-15 padding-top-5">培训城市</div>
                    <div class="box-1">
                        <div class=" input-div-3">
                            <input type="text" class="input-3 font-14" id="studyCity" name="studyCity" placeholder="请输入培训城市">
                        </div>
                    </div>

                </div>

            </div>

            <div class="am-u-sm-12 am-margin-bottom-sm">
                <div class="box">
                    <div class="width-70px font-15 padding-top-5">集训方向</div>
                    <div class="box-1">
                        <div class=" am-margin-bottom-xs input-div-3">
                        <select class="select-1" id="studyDirection" name="studyDirection">
                            <option value="1">学业倦怠</option>
                            <option value="2">亲子关系</option>
                            <option value="3">教育理念</option>
                            <option value="4">学习习惯</option>
                            <option value="5">人际关系</option>
                            <option value="6">沉迷网络</option>
                            <option value="7">情绪管理</option>
                            <option value="8">自控能力</option>
                        </select>
                        </div>
                    </div>

                </div>

            </div>
            <div class="am-u-sm-12 am-margin-bottom-sm">
                <div class="box">
                    <div class="width-70px font-15 padding-top-5">人数上限</div>
                    <div class="box-1">
                        <div class=" am-margin-bottom-xs input-div-3">
                            <input type="tel" class="input-3 font-14" id="maxStudent" name="maxStudent" placeholder="请输入人数上限">
                        </div>
                    </div>

                </div>

            </div>

            <div class="am-u-sm-12 ">
                <div class="box am-margin-bottom-sm">
                    <div class="width-70px font-15 padding-top-5">集训时间</div>

                    <div class="box-1">
                        <div class="  input-div-3">
                            <input type="date" id="startStudy" name="startStudy" class="input-3 font-14" placeholder="">
                        </div>
                    </div>

                    <div class="width-50px am-text-center padding-top-5 font-15">开始</div>
                </div>
                <div class="am-margin-bottom-sm box">
                    <div class="width-70px font-15 padding-top-5"></div>

                    <div class="box-1">
                        <div class="  input-div-3">
                            <input type="date" id="endStudy" name="endStudy" class="input-3 font-14" placeholder="">
                        </div>
                    </div>
                    <div class="width-50px am-text-center padding-top-5 font-15">结束</div>
                </div>
            </div>
            
            

            <div class="am-u-sm-12 ">
                <div class="box">
                    <div class="width-70px font-15 padding-top-5">集训价格</div>
                    <div class="box-1">
                        <div class=" am-margin-bottom-xs input-div-3">
                            <input type="tel" class="input-3 font-14" id="studyPrice" name="studyPrice" placeholder="请输入集训价格">
                        </div>
                    </div>
                    <div class="width-30px font-15 padding-top-5 am-text-center">
                        元
                    </div>

                </div>

            </div>
        </div>
    </div>

    <div class="bg-white am-margin-top-sm am-padding-top-sm am-padding-bottom-xs">
        <!-- 标签-->
        <div class="icon_26 am-text-center font-color-12 ">
            标签
        </div>

        <div class="font-12 font-color-16 am-margin-top-sm am-padding-left-sm">提示:请用几个关键词概括发布的内容，限10字以内</div>

        <div class="am-g am-padding-top-sm am-padding-bottom-xs">



            <div class="am-u-sm-12 ">
                <div class="box">
                    <div class="width-70px font-15 padding-top-5">标签一</div>
                    <div class="box-1">
                        <div class=" am-margin-bottom-xs input-div-3">
                            <input type="text" class="input-3 font-14" id="studyLabel1" name="studyLabel1" placeholder="请输入标签一">
                        </div>
                    </div>

                </div>

            </div>

            <div class="am-u-sm-12 ">
                <div class="box">
                    <div class="width-70px font-15 padding-top-5">标签二</div>
                    <div class="box-1">
                        <div class=" am-margin-bottom-xs input-div-3">
                            <input type="text" class="input-3 font-14" id="studyLabel2" name="studyLabel2" placeholder="请输入标签二">
                        </div>
                    </div>

                </div>

            </div>
            <div class="am-u-sm-12 ">
                <div class="box">
                    <div class="width-70px font-15 padding-top-5">标签三</div>
                    <div class="box-1">
                        <div class=" am-margin-bottom-xs input-div-3">
                            <input type="text" class="input-3 font-14" id="studyLabel3" name="studyLabel3" placeholder="请输入标签三">
                        </div>
                    </div>

                </div>

            </div>
        </div>

    </div>

    <div class="bg-white am-margin-top-sm am-padding-top-sm am-padding-bottom-xs">
        <!-- 集训内容-->
        <div class="icon_26 am-text-center font-color-12 ">
            集训内容
        </div>

        <div class="am-padding-bottom-sm">
            <div class="am-container font-color-13 font-14 am-margin-top-sm">
                <textarea class="textarea-2" rows="5" id="studyContent" name="studyContent" placeholder="介绍集训内容"></textarea>
            </div>
        </div>

    </div>

    <div class="bg-white am-margin-top-sm am-padding-top-sm">

        <div class="icon_26 am-text-center font-color-12  am-margin-bottom-sm">
            图片信息
        </div>

        <div class=" bg-white am-padding-bottom-xs">
            <ul class="am-avg-sm-4 am-thumbnails am-padding-left-xs am-padding-right-xs ">
                <!--<li class=""><img class="am-thumbnail" src="${ctx}/assets/images/upload/icon_16.png" /></li>-->
                <li class=""> <a href="javascript:;" class="file pic-margin">
                    <input type="file" name="studyUrl" id="file0">
                    <div class="" ><img class="width-100" id="img0" src="${ctx}/assets/images/icon/icon_03.png"><div id="headId" ></div></div>
                </a></li>
                <li class=""> <a href="javascript:;" class="file pic-margin">
                    <input type="file" name="studyUrl2" id="file1">
                    <div class="" ><img class="width-100" id="img1" src="${ctx}/assets/images/icon/icon_03.png"><div id="headId" ></div></div>
                </a></li>
                <li class=""> <a href="javascript:;" class="file pic-margin">
                    <input type="file" name="studyUrl3" id="file2">
                    <div class="" ><img class="width-100" id="img2" src="${ctx}/assets/images/icon/icon_03.png"><div id="headId" ></div></div>
                </a></li>
            </ul>
        </div>
    </div>

    <div class="am-container am-margin-top-sm">
        <div class="btn-4 word-space-2 padding-left-0" onclick="formSubmit()">提交</div>
    </div>

</section>
</form>

<script src="${ctx}/assets/js/jquery.min.js"></script>
<script src="${ctx}/assets/js/amazeui.min.js"></script>
<script>
	function formSubmit(){
		var studyTitle =$("#studyTitle").val();
		var studyDirection =$("#studyDirection").val();
		var maxStudent =$("#maxStudent").val();
		var startStudy =$("#startStudy").val();
		var endStudy =$("#endStudy").val();
		var studyPrice =$("#studyPrice").val();
		var studyLabel1 =$("#studyLabel1").val();
		var studyLabel2 =$("#studyLabel2").val();
		var studyLabel3 =$("#studyLabel3").val();
		var studyContent =$("#studyContent").val();
		var studyUrl =$("#file0").val();
		var studyCity=$("#studyCity").val();
		if(studyTitle==""){
			myAlert("请输入培训标题");
			return false;
		}
		if(studyCity==""){
			myAlert("请输入培训城市");
			return false;
		}
		
		if(studyTitle=="" || studyDirection=="" ||  maxStudent=="" || startStudy=="" || endStudy=="" || studyPrice=="" || studyLabel1=="" || studyContent=="" ){
			myAlert("请补充完整集训信息");
			return false;
		}
		if(studyUrl==""){
			myAlert("请上传集训logo");
			return false;
		}
		myAlert("集训信息上传后，请耐心等待后台审核");
		onclick=document.forms[0].submit();
	}
	function changeHead(){
		$("#headId").html("<font color='#5DC8B9'>头像已选择</font>");
	}

    $("[data-node='pay_type']").find(" li.type").click(function () {
        $("[data-node='pay_type']").find(" li.type .icon-gouxuan").removeClass("cur");
        $(this).find(".icon-gouxuan").addClass("cur");
    });

</script>
<script>
    $(function () {
         $("#file0").change(function(){
	var objUrl = getObjectURL(this.files[0]) ;
	console.log("objUrl = "+objUrl) ;
	if (objUrl) {
		$("#img0").attr("src", objUrl) ;
	}
	}) ;
	//建立一個可存取到該file的url
	function getObjectURL(file) {
		var url = null ; 
		if (window.createObjectURL!=undefined) { // basic
			url = window.createObjectURL(file) ;
		} else if (window.URL!=undefined) { // mozilla(firefox)
			url = window.URL.createObjectURL(file) ;
		} else if (window.webkitURL!=undefined) { // webkit or chrome
			url = window.webkitURL.createObjectURL(file) ;
		}
		return url ;
	}
	$("#file1").change(function(){
	var objUrl = getObjectURL(this.files[0]) ;
	console.log("objUrl = "+objUrl) ;
	if (objUrl) {
		$("#img1").attr("src", objUrl) ;
	}
	}) ;
	//建立一個可存取到該file的url
	function getObjectURL(file) {
		var url = null ; 
		if (window.createObjectURL!=undefined) { // basic
			url = window.createObjectURL(file) ;
		} else if (window.URL!=undefined) { // mozilla(firefox)
			url = window.URL.createObjectURL(file) ;
		} else if (window.webkitURL!=undefined) { // webkit or chrome
			url = window.webkitURL.createObjectURL(file) ;
		}
		return url ;
	}
	$("#file2").change(function(){
	var objUrl = getObjectURL(this.files[0]) ;
	console.log("objUrl = "+objUrl) ;
	if (objUrl) {
		$("#img2").attr("src", objUrl) ;
	}
	}) ;
	//建立一個可存取到該file的url
	function getObjectURL(file) {
		var url = null ; 
		if (window.createObjectURL!=undefined) { // basic
			url = window.createObjectURL(file) ;
		} else if (window.URL!=undefined) { // mozilla(firefox)
			url = window.URL.createObjectURL(file) ;
		} else if (window.webkitURL!=undefined) { // webkit or chrome
			url = window.webkitURL.createObjectURL(file) ;
		}
		return url ;
	}
    });
</script>
</body>
</html>